<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>详情1</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--第二步：引入css-->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css" >
    <link rel="stylesheet" type="text/css" href="css/base.css">
    <!--第三步：引入js-->
    <script src="js/jquery-2.0.3.js"></script>
    <script src="js/bootstrap.js"></script>
</head>
<body>
<div class="wrapper" style="width: 100%;height: 100%">
    <header style="background: #ffffff">
        <a href="http://localhost:63342/%E5%B0%8F%E7%B1%B3%E5%95%86%E5%9F%8E/%E5%B0%8F%E7%B1%B3%E5%95%86%E5%9F%8E.html"><img class="back" src="images/icon_back_n.png"></a>
        <div class="title"> <span style="text-align: center;line-height: .84rem;" class="title">商品分类</span></div>
        <span class="icon_search"><img src="images/search.png"></span>

    </header>
    <div class="b1">
        <div class="xiangqing_img"><img src="images/xiangqing1.jpg" alt=""/></div>
    </div>
    <div class="b2">
        <div class="div_name"><p class="xiangqing_name">小米手机5 标准版 3GB + 32GB/3D玻璃</p></div>
        <div style="font-size: .3rem; color: orangered;padding-left: .2rem" class="price"><strong>1999元</strong></div>
        <div class="jieshao" style="font-size: .22rem;padding-left: .2rem"><span class="shijian" style="color: orangered">【周五早10点开售】</span>骁龙820处理器/
            UFS2.0闪存/4轴防抖相机/16颗灯省电高亮屏幕/全功能NFC/4G+网络</div>
    </div>

    <ul class="b3">
        <li><span class="span_b3">白色</span></li>
        <li><span class="span_b3">黑色</span></li>
        <li><span class="span_b3">金色</span></li>
        <li><span class="span_b3">淡紫色</span></li>
    </ul>
    <div class="ui_b7">
        <h3>为您推荐</h3>
        <div class="listimg">
            <div class="viewport">
                <a href=""> <img src="images/tuijianlist01.jpg"></a>
                <a href=""><img src="images/tuijianlist02.jpg"></a>
                <a href=""><img src="images/tuijianlist03.jpg"></a>
                <a href=""><img src="images/tuijianlist04.jpg"></a>
                <a href=""><img src="images/tuijianlist05.jpg"></a>
                <a href=""><img src="images/tuijianlist06.jpg"></a>
                <a href=""><img src="images/tuijianlist07.jpg"></a>
                <a href=""><img src="images/tuijianlist08.jpg"></a>
                <a href=""><img src="images/tuijianlist10.jpg"></a>
                <a href=""><img src="images/tuijianlist11.jpg"></a>
            </div>


        </div>

    </div>

    <div class="bottom" style="padding-top: 30px">
        <section ><span style="font-size: .26rem;color: #999;text-align: center;vertical-align: middle">概述</span></section>
        <section><span style="font-size: .26rem;color: #999;text-align: center;vertical-align: middle">图集</span></section>
        <section><span style="font-size: .26rem;color: #999;text-align: center;vertical-align: middle">参数</span></section>
        <section><span style="font-size: .26rem;color: #999;text-align: center;vertical-align: middle">意外保</span></section>

    </div>
    <!--<div class="empty"></div>-->

    <div class="bbb" style="position: relative" >
        <img src="images/xqbig01.jpg" alt=""/>
        <img src="images/xqbig02.jpg" alt=""/>
        <img src="images/xqbig03.jpg" alt=""/>
        <img src="images/xqbig04.jpg" alt=""/>
        <img src="images/xqbig05.jpg" alt=""/>
        <img src="images/xqbig06.jpg" alt=""/>
        <img src="images/xqbig07.jpg" alt=""/>
        <img src="images/xqbig08.jpg" alt=""/>
        <img src="images/xqbig09.jpg" alt=""/>
        <img src="images/xqbig10.jpg" alt=""/>
        <img src="images/xqbig11.jpg" alt=""/>
        <img src="images/xqbig12.jpg" alt=""/>
        <img src="images/xqbig13.jpg" alt=""/>
        <img src="images/xqbig14.jpg" alt=""/>
        <img src="images/xqbig15.jpg" alt=""/>
        <img src="images/xqbig16.jpg" alt=""/>
        <img src="images/xqbig17.jpg" alt=""/>
        <img src="images/xqbig18.jpg" alt=""/>

        <a href="">
        <div class="gototop" style="width: .7rem;height: .7rem; position:fixed;bottom: 1.3rem;right: .3rem;">
        <img src="images/top.png">
        </div>
        </a>

    </div>

</div>

<div class="kaishou" style="position: fixed;clear: both;">
    <section class="home"><img src="images/icon_home.png" alt=""/></section>
    <a href="http://localhost:63342/%E5%B0%8F%E7%B1%B3%E5%95%86%E5%9F%8E/%E8%B4%AD%E7%89%A9%E8%BD%A62.html"><section class="button" >周五早10点开售</section></a>
    <section class="gouwuche"><img src="images/icon_gouwuche.png" alt=""/></section>

</div>

</body>

</html>

<script>
    $(function()
    {
        function fullwidth()
        {
            if($('body').width() >= 640)
            {
                $('html').css('font-size',100 + 'px');
                return;
            }
            var scale = $('body').width() / 640;
            $('html').css('font-size',scale * 100 + 'px');
        }
        fullwidth();
        $(window).resize(function()
        {
            fullwidth();
        })
    });
</script>